<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<canvas id="canvas1" width="800" height="500">
    			只是一个canvas标签，然而你看不到
		</canvas>
	</body>
	<style>
		#canvas1 {}
	</style>
	<script>
		var canvas = document.getElementById("canvas1");
		var context = canvas.getContext("2d");
		//		context.strokeStyle="red";
		//		context.lineWidth = 4;
		//		context.moveTo(300,400);
		//		context.lineTo(700,400);
		//		context.lineCap ="round";
		//		context.stroke();

		context.fillStyle = 'yellow';
		context.strokeStyle = "red";
		//		context.beginPath();
		//		context.lineWidth = 2;
		//		context.moveTo(10, 10);
		//		context.lineTo(10, 110);
		//		context.lineTo(110, 110);
		//		context.lineTo(10, 10);
		//		context.closePath();
		//		context.stroke();

		//		context.fillStyle = "yellow";
		//		context.rect(100, 100, 100, 100);
		//		context.fill();
		//		context.closePath();
		//		context.stroke();

		context.beginPath();
		context.fillStyle = "yellow";
		context.lineWidth = 5;
		context.arc(300, 200, 100, 0, Math.PI * 2, true);
//		context.arc(300, 200, 100, 0, Math.PI * 2, true);
		context.fill();
		context.stroke();
	</script>

</html>